<template>
  <el-card class="content small-padding-card">
    <top-label v-model="index" class="move-up">
      <span :slot="0">埋深变化分析</span>
      <span :slot="1">人工与自动化对比</span>
      <span :slot="2">数据统计</span>
    </top-label>
    <single-point-analysis
      v-if="index === 0"
      :source="node.singlePoint"
      :node="node"
    ></single-point-analysis>
    <comparison-automation
      v-if="index === 1"
      :node="node"
    ></comparison-automation>
    <list v-if="index === 2" :source="node.list" :node="node"></list>
  </el-card>
</template>

<script>
import TopLabel from "~/components/TopLabel";
import ComparisonAutomation from "~/views/monitor-control/statistical-analysis/saturation-line/ComparisonAutomation";
import SinglePointAnalysis from "~/views/monitor-control/statistical-analysis/saturation-line/SinglePointAnalysis";
import List from "~/views/monitor-control/statistical-analysis/saturation-line/List";
export default {
  name: "SurfaceDisplacement",
  components: {
    SinglePointAnalysis,
    ComparisonAutomation,
    TopLabel,
    List,
  },
  props: {
    node: Object,
  },
  data() {
    return {
      index: 0,
    };
  },
  created() {
    if (window.sessionStorage.getItem("indexsa") != null) {
      this.index =Number(window.sessionStorage.getItem("indexsa"));
    }
  },
  watch: {
    index: function (indexra, oldVal) {
     window.sessionStorage.setItem("indexsa", indexra);
      // console.log(val);
    },
  },
};
</script>

<style scoped>
.content {
  margin-left: 10px;
  padding-top: 5px;
}
.move-up {
  transform: translateY(-5px);
}
</style>
